// 修改 ElementPlus 样式

// * 设置 notification 层级在 loading 之上
.el-notification {
	z-index: 99999 !important;
}

// * 设置 message 层级在 loading 之上
.el-message {
	z-index: 99999 !important;
}

// * el-table 样式
.table-box {
	display: flex;
	flex-direction: column;
	height: 100%;

	// 表格 search 样式
	.table-search {
		display: flex;

		.el-form {
			max-width: 1260px;

			.el-form-item {
				margin-right: 15px;

				.el-input {
					width: 200px;
				}
			}

			.more-item {
				display: inline;
			}
		}

		.search-operation {
			white-space: nowrap;
			margin-left: 10px;

			.search-isOpen {
				margin-left: 20px;
			}
		}
	}

	// 表格 header 样式
	.table-header {
		padding: 10px 0 20px 0;

		.header-button {
			float: left;
		}

		.refresh {
			float: right;
		}
	}

	// el-table 表格样式
	.el-table {
		// 表格自适应撑满整个页面(设置了 flex:1,页面上表格必须添加 height 属性)
		flex: 1;

		.el-table__header th,
		.el-table__body td {
			text-align: center;
		}

		.el-table__header th {
			background: #fafafa;
			color: #252525;
			font-weight: bold;
			font-size: 15px;
			height: 50px;
		}

		// 解决 el-table 中 header 文字换行问题
		.el-table__header .el-table__cell>.cell {
			white-space: nowrap;
		}

		.el-table__row {
			height: 52px;
		}

		.el-button--text {
			height: 0;
		}

		// 解决表格空白样式不居中问题(仅在element-plus中)
		.el-table__empty-block {
			position: absolute;
			left: 50%;
			top: 50%;
			transform: translate(-50%, -50%);
		}

		.table-empty {
			line-height: 30px;
		}

		// 解决 keep-alive || 浏览器窗口大小变化 导致 el-table 样式错乱问题
		.el-table__body-wrapper {
			height: calc(100% - 50px) !important;
		}

		.el-table__inner-wrapper,
		.el-scrollbar__wrap {
			height: 100% !important;
		}
	}

	// 表格 pagination 样式
	.el-pagination {
		display: flex;
		margin: 23px 0 10px 0;
		justify-content: flex-end;
	}
}

// * el-drawer 样式
.el-drawer {

	// drawer header 样式
	.el-drawer__header {
		border-bottom: 1px solid #ebeef5;
		padding: 15px 20px 14px 20px;
		margin-bottom: 0px;

		span {
			font-size: 17px;
			color: #303133;
		}
	}

	// drawer header 样式
	.el-drawer__footer {
		border-top: 1px solid #ebeef5;
	}

	.el-select {
		width: 100%;
	}

	// drawer-form 多列 form-item
	.drawer-multiColumn-form {
		display: flex;
		flex-wrap: wrap;

		.el-form-item {
			width: 47%;

			&:nth-child(2n-1) {
				margin-right: 5%;
			}
		}
	}
}

// * el-drawer 查看数据样式（待完善）
.el-drawer__view {
	.el-input.is-disabled .el-input__inner {
		background-color: #fff;
		color: #606266;
	}

	.el-form-item__label:before {
		content: "" !important;
	}

	.el-switch.is-disabled {
		opacity: 1;
	}
}

// * el-dialog 样式
.el-dialog {
	.el-dialog__header {
		border-bottom: 1px solid #f0f0f0;
		margin: 0;
		padding: 15px 20px;

		.el-dialog__title {
			font-size: 17px;
			color: #303133;
		}
	}
}